<template>
	<view class="login-wrap">
		<view class="login-header">
			<text>让赚钱变得更容易</text>
		</view>
		<view class="tip">
			<text>生意上门 减少空转 海量订单 收入自由</text>
		</view>
		<view class="login-container">
			<view class="p30">
				<view class="group-bd">
					<view class="form-level d-s-c">
						<view class="d-s-c field-name">
							<!-- <text class="orange">*</text> -->
							<!-- <text class="gray3">手机号：</text> -->
							<view class="gray3">
								<image src="../../static/app/phone_icon.png" mode=""></image>
							</view>
						</view>
						<view class="val flex-1"><input type="number" v-model="formData.mobile" placeholder-class="placeholder-class"
							 placeholder="输入手机号" :disabled="is_send" /></view>
					</view>
					<view class="form-level d-s-c">
						<view class="d-s-c field-name">
							<view class="gray3">
								<image src="/static/app/phone_icon.png" mode=""></image>
							</view>
						</view>
						<view class="val flex-1"><input type="password" v-model="formData.password" placeholder-class="placeholder-class"
							 placeholder="输入注册密码" /></view>
					</view>
					<view class="form-level d-s-c">
						<view class="d-s-c field-name">
							<view class="gray3">
								<image src="/static/app/phone_icon.png" mode=""></image>
							</view>
						</view>
						<view class="val flex-1"><input type="password" v-model="formData.password1" placeholder-class="placeholder-class"
							 placeholder="输入确认密码" /></view>
					</view>
					<view class="form-level d-s-c">
						<view class="d-s-c field-name">
							<view class="gray3">
								<image src="../../static/app/msm_icon.png" mode=""></image>
							</view>
						</view>
						<view class="val flex-1 d-b-c">
							<input class="flex-1" type="number" v-model="formData.code" placeholder-class="placeholder-class" placeholder="输入验证码" />
							<button class="get-code-btn" type="default" @click="sendCode" :disabled="is_send">{{ send_btn_txt }}</button>
						</view>
					</view>
				</view>
			</view>

			<view class="btns p30">
				<button class="default" type="default" @click="formSubmit">注册</button>
				<!-- <button ref="not" class="btn1" type="default" @click="formSubmit($event)">无车加入</button>
				<button ref="have" type="default" @click="formSubmit($event)" >有车加入</button> -->
			</view>
			<view class="bottom-tip">
				<view>
					<checkbox-group @change="staChange()">
						<checkbox value="cb" class="checkbox" :checked="status" />
					</checkbox-group>								
				</view>
				<view>
					我已阅读并同意
				</view>
				<view class="tip-title" @click="msgshow">《软件使用信息服务协议》</view>
				<view class="msgagreem-item" v-if="msgShow">
					<view @click="close">
						<image src="../../static/app/close.png"></image>
					</view>
					<view class="msgagreem" v-html="msgagreem" >
						
					</view>
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				/*表单数据对象*/
				formData: {
					/*手机号*/
					mobile: '',
					password: '',
					password1: '',
					/*验证码*/
					code: '',
					reg_source: 'APP',
					referee_id: ''
				},
				/*是否已发验证码*/
				is_send: false,
				/*发送按钮文本*/
				send_btn_txt: '获取验证码',
				/*当前秒数*/
				second: 60,
				ip: '',
				msgagreem:'',//协议
				msgShow:false,//协议显示
				status:false,//复选框的状态
			};
		},
		onLoad(option) {
			this.getmAgreement();
			this.formData.referee_id = option.referee_id ? option.referee_id : '';
		},
		methods: {
			/* 获取复选框的状态 */
			staChange(){
				this.status = !this.status;
				console.log(this.status)
			},
			close(){
				this.msgShow = false;
			},
			/* 协议显示 */
			msgshow(){
				this.msgShow = true;
			},
			/* 获取协议*/
			getmAgreement() {
				let self = this;
				uni.showLoading({
					title: '加载中'
				});
				self._get('plus.article.article/detail', 
				{
					article_id:10011
				},
				 function(res) {
					console.log(res);
					self.msgagreem = res.data.detail.article_content;
					uni.hideLoading();
				});
			},
			gotoPage(e) {
				uni.navigateTo({
					url: '/pages/register/register-info/register-info'
				});
			},
			/*提交*/
			formSubmit: function(e) {
				let self = this;
				if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.formData.mobile)) {
					uni.showToast({
						title: '手机有误,请重填！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				if (self.formData.password == '') {
					uni.showToast({
						title: '密码不能为空！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}

				if (self.formData.password != self.formData.password1) {
					uni.showToast({
						title: '两次密码不一致！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				// if (self.formData.code == '') {
				// 	uni.showToast({
				// 		title: '验证码不能为空！',
				// 		duration: 2000,
				// 		icon: 'none'
				// 	});
				// 	return;
				// }
				if (self.status == false) {
					uni.showToast({
						title: '请勾选协议！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}
				// let listData = [];
				// listData.mobile=self.formData.mobile;
				// listData.password=self.formData.password;
				// listData.code=self.formData.code;
				uni.showLoading({
					title: '正在提交'
				});
				self._post(
					'user.userweb/register',
					self.formData,
					result => {
						uni.navigateTo({
								url: '/pages/login/weblogin'
							});
						// 记录token user_id
						// uni.setStorageSync('token', result.data.token);
						// uni.setStorageSync('user_id', result.data.user_id);
						
						// uni.navigateBack();
						// 执行回调函数
						// if (self.$refs.not.innerHTML == '无车加入') {
						// 	console.log("无车加入");
						// 	uni.navigateTo({
						// 		url: '/pages/register/register-info/register-info'
						// 	});
						// } else {
						// 	console.log("有车加入");
						// 	uni.navigateTo({
						// 		url: '/pages/register/register-info/register-info'
						// 	});
						// }

					},
					false,
					() => {
						uni.hideLoading();
					}
				);
			},

			/*发送短信*/
			sendCode() {
				let self = this;

				if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(self.formData.mobile)) {
					uni.showToast({
						title: '手机有误,请重填！',
						duration: 2000,
						icon: 'none'
					});
					return;
				}

				self._post(
					'user.userweb/sendCode', {
						mobile: self.formData.mobile,
						type:'login'
					},
					result => {
						if (result.code == 1) {
							uni.showToast({
								title: '发送成功'
							});
							self.is_send = true;
							self.changeMsg();
						}
					}
				);
			},

			/*改变发送验证码按钮文本*/
			changeMsg() {
				if (this.second > 0) {
					this.send_btn_txt = this.second + '秒';
					this.second--;
					setTimeout(this.changeMsg, 1000);
				} else {
					this.send_btn_txt = '获取验证码';
					this.second = 60;
					this.is_send = false;
				}
			},
		}
	};
</script>

<style lang="scss" scoped>
	@import 'register.scss';
</style>
